<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<meta name="keywords" content="龙泉旅游网">
<meta name="description" content="龙泉旅游网">
<!-- Bootstrap -->
<link href="__PUBLIC__/css/bootstrap.min.css" rel="stylesheet">
<link href="__PUBLIC__/css/style.css" rel="stylesheet">
<script src="__PUBLIC__/js/jquery-2.0.2.min.js"></script>
<script src="__PUBLIC__/js/bootstrap.min.js"></script>

<!--[if lt IE 9]>
<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="http://scottjehl.github.io/Respond/dest/respond.src.js"></script>
<![endif]-->

</head>

<body>
<header>
    <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0px;">
      <!-- We use the fluid option here to avoid overriding the fixed width of a normal container within the narrow content columns. -->
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-8">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#"><span class="glyphicon glyphicon-home"></span> 丽水旅游网</a>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-8">
          
        </div>
      </div>
    </nav>
</header>


<div class="container">

<section class="mybg">

<div class="jumbotron mybg color_w" style="margin-bottom:0;">
  <h4>2014古堰画乡"缤纷之夜" ---暨夏季夜游活动:</h4>
    <p style="font-size:14px;">夜幕下的古堰画乡，灯火辉煌。画乡老街大红灯笼高高挂，千年老樟树在灯光的照耀下演绎着别样的故事与精彩，湖面上的灯船更为古镇平添几分夜的神韵，人群熙嚷，仰望天空，繁星点点，不知是天上人间，在这炎热的夏天，来到古堰画乡，享受夏日的清凉快感！</p>
</div>
</section>

<br>


	<div class="row">
    	<div class="col-xs-6 text-center">
        	<!-- Button trigger modal -->
            <button class="btn btn-primary btn-lg btn-block" data-toggle="modal" data-target="#myModal">
              我要报名
            </button>
        </div>
        
        <div class="col-xs-6 text-center">
        	<!-- Button trigger modal -->
            <button class="btn btn-primary btn-lg btn-block" data-toggle="modal" data-target="#seachModal">
              我要查询
            </button>
        </div>
    </div>
    <br>
    <div class="row">
    	<div class="col-xs-12">
        
        	<div class="panel panel-default">
              <div class="panel-heading">已报名人数: <strong>{$count}</strong>人</div>
              <div class="panel-body">
                <div class="table-responsive" style="background:#fff">  
                <table class="table table-bordered">
                	<thead>
                    <tr>
                    <td>编号</td>
                    <td>姓名</td>
                    <td>票数</td>
                    <td width="10%">状态</td>
                    </tr>
                    </thead>
                    <tbody>
                        <volist name="list" id="data">                        
                        <tr>
                        <td>{$i}</td>
                        <td>{$data.name}</td>
                        <td>{$data.number}张</td>
                        <td>
                        <if condition="$data.state eq 1 "><a class="btn btn-success btn-xs">已通过</a><else /> <a class="btn btn-danger btn-xs">未通过</a></if>
                        </td>
                        </tr>
                        </volist>
                    </tbody>
                </table>
            </div>
              </div>
            </div>
            
    	</div>
    </div>



</div>



<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">报名表单</h4>
      </div>
      <div class="modal-body">
        <form method="post" id="addform">
            
            <div class="form-group">
            <label>姓名</label>
            <input type="text" class="form-control" name="name" placeholder="姓名">
            </div>
            <div class="form-group">
            <label>手机</label>
            <input type="text" class="form-control" name="tel" placeholder="联系电话">
            </div>
            
            <div class="form-group">
            <label>身份证</label>
            <input type="text" class="form-control" name="idcard" placeholder="身份证">
            </div>
            
            <div class="form-group">
            <label>地址</label>
            <input type="text" class="form-control" name="add" placeholder="家庭住址">
            </div>
            
            <div class="form-group">
            <label>购买票数(张)</label>
            <input type="text" class="form-control" name="number" placeholder="张">
            </div>
            
        <button id="aignupbt" class="btn btn-primary btn-block">提交</button>
        </form>
      </div>
    </div>
  </div>
</div>

<!-- Modal -->
<div class="modal fade" id="seachModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">查询是否报名成功</h4>
      </div>
      <div class="modal-body">
        <form role="form" id="seachform">
            
            
            <div id="seach_alert" class="alert alert-warning alert-dismissible fade in" role="alert">
                <p>查询状态会在下方显示</p>
                <hr>
                <div id="context">
                
                </div>         
            </div>
            
            
            <div class="form-group">
            <label>输入身份证</label>
            <input type="text" class="form-control" name="idcard" placeholder="身份证">
            </div>
            
            
        <button type="submit" id="seachbt" class="btn btn-primary btn-block">查询</button>
        
        
        
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭表单</button>
      </div>
    </div>
  </div>
</div>





<script type="text/javascript">
$(document).ready(function(){				
	$("#aignupbt").click(function(){
		var requestData = $('#addform').serialize();
		$.post("{:U('to_sign_up')}",requestData,function(data){
			if(data.state===true){
				alert('报名成功');
				$('#myModal').modal('toggle')
			}else{
				alert(data.state);
				return false;
				}				
			});
			return false;			
		});		
	});
</script>







<script type="text/javascript">
$(document).ready(function(){				
	$("#seachbt").click(function(){
		var btn=$(this);
		btn.button('loading');
		var requestData = $('#seachform').serialize();
		//if(!requestData.idcard){
//			alert('请输入身份证');
//			btn.button('reset');
//			return false;
//		}
		$.post("{:U('seach')}",requestData,function(data){
			if(data){	
				if(data.state=='0'){
					data.state='未通过';
				}else if(data.state='1') data.state='已通过';	
				var html="";
				html += "<div class='col-xs-7'>";
				html += "姓名：" + data.name + "<br>";
				html += "电话：" + data.tel + "<br>";
				html += "身份证：" + data.idcard + "<br>";
				html += "地址：" + data.add + "<br>";
				html += "张数：" + data.number + "张<br>";
				html += "状态：" + data.state + "<br>"; 
				html += "</div><div class='col-xs-5'>";
				html += "<img src=" + data.img + "></div><hr  style=\"clear:both\">";
				$('#seach_alert').removeAttr("style");
				$('#context').html(html);
				btn.button('reset');
			}				
			});
			return false;			
		});		
	});
</script>
</body>
</html>
